<!-- 奥铃官网       首页开始 -->
<!doctype html>
<html lang="en">

<head>
	<link rel="stylesheet" href="__INDEX__/mobile/css/index.css">
	<link rel="stylesheet" href="__INDEX__/mobile/css/threesixty.css">

	{include file="mobile/public/resource" /}
</head>

<body>
	{include file="mobile/public/header" /}

	<!-- 内容区 -->
	<div id="container">
		<!-- banner -->
		<div class="swiper-container swiper-container1" style="">
			<div class="swiper-wrapper swiper-wrapper1">
				{volist name="banner" id="vo"}
				<div class="swiper-slide swiper-slide1">
					<a href="{$vo['src']}"><img src="{$vo['m_img']}" alt=""></a>
				</div>
				{/volist}
			</div>
    		<div class="swiper-pagination"></div>
		</div>


		<!-- 360   车型展示 -->
		<img src="__INDEX__/mobile/img/index/360.png" alt="" class="car360">
		<!-- 车型切换 -->
		<div class="swiper-container swiper-container2" style="">
			<div class="swiper-wrapper swiper-wrapper2">
				{volist name="cx" id="vo" key='k'}
				<div class="swiper-slide swiper-slide2">
				
					<span>{$vo['name']}</span>
					<img src="{$vo['img']}" alt="" id="btn{$k}">
					<!-- <img src="{$vo['img']}" alt="" onlick="bnt({$k})"> -->
					
				</div>
				{/volist}
				<img src="__INDEX__/mobile/img/index/xz.png" alt="" style="width:5.2813rem;height:0.2813rem;position: absolute;left: 5%;top: 78%;">
			</div>
			<!-- <div class="swiper-pagination"></div> -->
			<div class="swiper-button-prev swiper-button-black"></div>
			<div class="swiper-button-next swiper-button-black"></div>
		</div>

		<img src="__INDEX__/mobile/img/index/select.png" alt="" class="select">

		<!-- 360  度    -->
		<div class="box">
			<!-- <h1 style="text-align: center;line-height: 2.375rem; font-size: 0.9063rem;">官方指导价 <span
							style="color:#5f5f5f; ">￥90,999 -123,999</span></h1> -->
			<div class="threesixty-wrapper car360">
				<div class="threesixty" id="threesixty" data-item='page0-1-btn8' data-action='click-theme' style="height:100% !important;">
					<!-- put your preloader here -->
					<ol class="threesixty_images" style="height: 100%">
					</ol>
					<div class="spinner" style="margin-top:20% !important;">
						<span>0%</span>
					</div>
					<!-- end preloader -->
				</div>
			</div>
		</div>
		<!-- 立即订制 -->
		
			<a href="{:url('product/made')}"><div class="mustDz"></div></a>
		

		<!-- 中间   3   广告  -->
		<div class="poster">
			<div class="poster-son">
				<a href="{:url('testdrive/index')}?id=2"><img src="__INDEX__/mobile/img/index/zxyd.png" alt=""class="btn4"></a>
			</div>
			<div class="poster-son">
				<a href="{:url('testdrive/index')}?id=1"><img src="__INDEX__/mobile/img/index/yysj.png" alt=""class="btn3"></a>
			</div>
			<div class="poster-son">
				<a href="http://aoling.douyar.cc/index/product/shopping.html#jxs"><img src="__INDEX__/mobile/img/index/jxs.png" alt="" class="btn2"></a>
			</div>
		</div>



		<!-- 优惠信息 -->
		<img src="__INDEX__/mobile/img/index/Discount.png" alt="" class="Discount">
		<div class="swiper-container swiper-container4" style="">
			<div class="swiper-wrapper swiper-wrapper3">
				{volist name="yhxx" id="vo"}
				
					<div class="swiper-slide swiper-slide3">
					<a href="http://aoling.douyar.cc/index/news/index.html?id=6">
						<img src="{$vo['img1']}" alt="">
					</a>
					</div>
				
				{/volist}
			</div>
			<!-- <div class="swiper-button-prev swiper-button-black"></div> -->
			<!-- <div class="swiper-button-next swiper-button-black"></div> -->
		</div>



		<!-- 奥铃资讯 -->
		<img src="__INDEX__/mobile/img/index/zx.png" alt="" class="information">
		
		<div class="swiper-container swiper-container5 information_son">
			<div class="swiper-wrapper swiper-wrapper3">
				{volist name="alzx" id="vo"}
				<div class="swiper-slide swiper-slide3">
				<a href="{:url('News/show')}?id={$vo.id}">
					<img src="{$vo['img1']}" alt="">
					<div class="information_son_container">
						<div class="line"></div>
						<a href="{:url('News/show')}?id={$vo.id}" class="font">
							<p>{$vo['title']}</p>
							<p>{$vo['description']}</p>
						</a>
					</div>
				</div>
				{/volist}
				</a>
			</div>
			<!-- <div class="swiper-button-prev swiper-button-black"></div> -->
			<!-- <div class="swiper-button-next swiper-button-black"></div> -->
		</div>
	</div>
	<!-- <ul id="rightNav">
		<a href="">
			<li>
				<img src="./img/nav/1.png" alt="">
				<div class="child"></div>
			</li>
		</a>
		<a href="">
			<li>
				<img src="./img/nav/2.png" alt="">
				<div class="child"></div>
			</li>
		</a>
		<a href="">
			<li>
				<img src="./img/nav/3.png" alt="">
				<div class="child"></div>
			</li>
		</a>
		<a href="">
			<li>
				<img src="./img/nav/4.png" alt="">
				<div class="child"></div>
			</li>
		</a>
	</ul> -->

	{include file="mobile/public/footer" /}






	<script type="text/javascript" src="__INDEX__/mobile/js/jquery.threesixty.js"></script>
 	<script src="__INDEX__/mobile/js/index.js"></script>

	<script>
		$(document).on('click','#btn2,#btn3',function(){
			alert('敬请期待')
		})
		
		// function bnt2() {
		// 	alert('敬请期待')
		//   }
		//   function bnt3() {
		// 	alert('敬请期待')
		//   }
		layui.use('form', function () {
			var form = layui.form;

			//各种基于事件的操作，下面会有进一步介绍
		});
	</script>

	<script>
		$('#rightNav li').each(function (i, index) {
			$(this).hover(function () {
				$(this).find('.child').stop().animate({
					'left': '-129%',
					'opacity': '1'
				}, 500);
			}, function () {
				$(this).find('.child').stop().animate({
					'left': '15%',
					'opacity': '0'
				}, 500);
			})
		})




		// var str = '__INDEX__/mobile/image0/';
		// $("#myCar").vc0dEye({
		// 	imagePath: str,
		// 	totalImages: 32,
		// 	imageExtension: "png"
		// });



		$(function () {
			var str = '/public/static/index/image1/';
			// $("#myCar").vc0dEye({
			// 	imagePath:str,
			// 	totalImages:32,
			// 	imageExtension:"png"
			// });	
			function initThreesixty(type) {
				var $threeSixty = $('#threesixty');
				$threeSixty.find("ol").empty();
				var colors = ['White', 'Black', 'Blue', 'Red', 'Grey', 'Silver'];
				var hasColor = colors.indexOf(type.trim());
				var color = hasColor > -1 ? type : 'White';
				$threeSixty.ThreeSixty({
					totalFrames: 32,
					endFrame: 32,
					currentFrame: 1,
					imgList: '.threesixty_images',
					progress: '.spinner',
					imagePath: str,
					filePrefix: '0-',
					ext: '.png',
					zeroPadding: true, // 1.jpg = > 01.jpg
					zeroBased: true, // 从0开始
					height: 700,
					width: 1280,
					navigation: false,
					responsive: true
				});
			}
			initThreesixty('White');
		})



		// $(".btn2").click(function () {
		// 	windows.location.href = './dgsm.html';
		// });
		// $(".btn3").click(function () {
		// 	location.href = './yysj.html';
		// });
	</script>
</body>

</html>